<template>
   <el-select @change="changeChannel" clearable :value="value" placeholder="请选择">
        <el-option v-for="item in channelOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
   </el-select>
</template>

<script>
export default {
     name: 'my-channel',
     props: ['value'],
     data(){
         return{
              // 频道选项
             channelOptions: [],
         }
     },
     created(){
         this.getChannelOptions()
     },
     methods:{
        // 选择频道
        changeChannel(val){
            // 如果清空
            if (val === '') val = null

             // 将改变的数据传递给父组件
             this.$emit('input', val)
        },
        //  获取频道数据
        async getChannelOptions() {
            const res = await this.$http.get("channels")
            this.channelOptions = res.data.data.channels
        },
     }
}
</script>

